<!DOCTYPE>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>新建模型</title>
    <link rel="stylesheet" href="../../../static/lib/layui/css/layui.css"  media="all">
    <link rel="stylesheet" href="../../../static/plugin/layer/skin/layer.css">
    <link rel="stylesheet" href="../../../static/css/x-admin.css" media="all">
    <link rel="stylesheet" href="../../../static/css/dj-css.css">

    <style type="text/css">

    </style>
</head>
<body>
<div id="createApp">
    <div>
        <form >

            <fieldset class="layui-elem-field layui-field-title" >
                <legend>新建模型</legend>
            </fieldset>

            <div class="dj-select dj-select-inline" style="margin-bottom:20px;">
                <label   style="height:auto;padding:3px 15px;width:110px;text-align: right;">流程分类</label>
                <div class="dj-select-content" style="width: 196px;">
                    <div class="dj-select-input" flag = 'true' style="width: 190px;">
                        <span class="dj-selected readOnly" type="text" name="category"  selectedCode='' style="height:32px;line-height:32px;width: 190px;" id="category">请选择流程类型</span>
                        <i></i>
                    </div>
                    <ul class="dj-select-list" style="width: 190px;">
                        <li code="0">全部分类</li>
                        <li v-for="item in msgType" :code="item.code">{{item.name}}</li>
                    </ul>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">模块名称</label>
                <div class="layui-input-inline" >
                    <input type="text" name="name" v-model="parameter.name" placeholder="请输入模块名称" autocomplete="off" class="layui-input" >
                </div>
                <span class="x-red">*必填</span>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">模块标识</label>
                <div class="layui-input-inline" >
                    <input type="text" name="key" v-model="parameter.key" placeholder="请输入模块标识" autocomplete="off" class="layui-input" >
                </div>
                <span class="x-red">*必填</span>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">模块描述</label>
                <div class="layui-input-inline" >
                    <textarea style="width:500px;height:200px;" type="text" name="description" v-model="parameter.description" placeholder="请填写模块描述" autocomplete="off" class="layui-input" ></textarea>
                </div>
                <span class="x-red">*必填</span>
            </div>


        </form>
        <div class="layui-form-item">
            <label  class="layui-form-label"></label><button class="layui-btn" lay-submit="" lay-filter="demo2" @click="sub">提交</button>
        </div>
    </div>
</div>
<script src="../../../static/lib/jquery.min.js"></script>
<script src="../../../static/lib/layui/layui.js" charset="utf-8"></script>
<script src="../../../static/lib/vue.min.js"></script>
<script src="../../../static/lib/vue.min.js"></script>
<script src="../../../static/lib/x-layui.js"></script>
<script src="../../../static/lib/dj-js.js"></script>
<script type="text/javascript">

    var VM = new Vue({
        el:"#createApp",
        created:function(){
            this.getMsgType();
//            this.getMessagesLists();
        },
        data:{
            parameter:{
                category:'',
                name:'',
                key:'',
                description:''
            }
        },
        methods: {
            getMsgType:function(){
                var _this = this;
                $.ajax({
                    url:"../../../actmodel/processType.do",
                    dataType:"json",
                    type:"POST",
                    async:false,
                    success:function (res) {
                        console.log(res);
                        if(res.msg=="success"){
                            _this.msgType = res.result.categoryList;

                        }else{
                            layer.msg("没有查询到数据！", {icon: 1})
                        }
                    },
                    error:function (XMLHttpRequest) {
                        layer.msg("系统错误", {icon: 1});
                    }
                })
            },
            getMessagesLists: function () {
                var _this = this;
                if(this.parameter.imageShow){
                    this.imgSrc = 'http://182.254.136.235.:81/uploads/'+this.parameter.imageShow;
                }else{
                    this.imgSrc = "${rc.contextPath}/static/images/timg.jpg";
                }
//                console.log(this.parameter.receiveObject);
                _this.receiveObject1 = this.parameter.receiveObject.split(",");
                $.ajax({
                    type: "post",
                    url: '${rc.contextPath}/messages/getInitInfo.do',
                    dataType: "json",
                    success: function (res) {
                        console.log(res);
                        _this.messagesLists = res.result.list;
                        _this.parameter.publish = res.result.username;
                        _this.dictionariesList = res.result.dictionariesList;
                        //选中返回的 已选人物
                        _this.messagesLists.forEach(function(item,index){
                            item.departmentList.forEach(function(subItem,index1){
                                subItem.dicUsersList.forEach(function(user,index2){
                                    _this.receiveObject1.forEach(function(myUser,myIndex){
                                        if(myUser == user.userName){
//                                            if (typeof user.checked == "undefined") {
                                            Vue.set(user, "checked", true);
//                                            }
                                        }
                                    })

                                });
                            });
                        });
                    }
                })
            },
            selectUsers: function (item) {
                if (typeof item.checked == "undefined") {
                    Vue.set(item, "checked", true);
                } else {
                    item.checked = !item.checked;
                }
                this.parameter.receiveObject = this.receiveObject1.join(",");
//                console.log(this.receiveObject1);
            },
            sub: function () {
                this.parameter.category = $("#category").attr("selectedCode");
                var _this = this;
//                if (this.parameter.category == null||this.parameter.category == '') {
//                    layer.msg("请选择流程分类！", {icon: 1});
//                    return false;
//                }
                if (this.parameter.name == "") {
                    layer.msg("请输入模块名称！", {icon: 1});
                    return false;
                }
                if (this.parameter.key == "") {
                    layer.msg("请输入模块标识！", {icon: 1});
                    return false;
                }
                if (this.parameter.description == "") {
                    layer.msg("请输入模块描述！", {icon: 1});
                    return false;
                }
                //提交接口
                $.ajax({
                    type: "post",
                    url: '${rc.contextPath}/actmodel/create2.do',
                    data: _this.parameter,
                    dataType: "json",
                    success: function (data) {
                        console.log(data);
                        //关闭窗口
                        layer.msg("操作成功", {icon: 0});
                        var pindex = parent.layer.getFrameIndex(window.name); //获取窗口索引
//                        parent.layer.close(index);
//                        parent.window.location.reload();

                        if(data.code==200){
                            console.log("将要跳转！！！");
                            parent.window.open( "${rc.contextPath}/act/process-editor/modeler.jsp?modelId="+data.result.modelId , "_blank" );
//
//                                   parent. layer.close(index);//关闭确定弹出框
//                            parent.layer.close(pindex);//关闭新建窗口
                            layer.open({
                                content: '确认提交将跳转！',
                                btn: ['确认', '取消'],
                                yes: function(index, layero) {

                                    parent.parent.window.open ( "/act/process-editor/modeler.jsp?modelId="+data.result.modelId , "_blank" );
//
//                                    layer.close(index);//关闭确定弹出框
                                    parent.layer.close(pindex);//关闭新建窗口
//

                                },
                                btn2: function(index, layero) {

                                }
                                ,
                                cancel: function() {
                                    //右上角关闭回调

                                }
                            });

//                            console.log(2);
//                            parent.window.open ( "https://www.baidu.com" , "_blank" ) ;
//                            window.location.href = "https://www.baidu.com";
//                            window.location.href = "${rc.contextPath}/page/activiti/act/act/process-editor/modeler.jsp?modelId="+data.result.modelId;
                        }else{
                            window.location.href = "javascript:location.replace(location.href)";
                        }

                    }
                })
            },
            selectSelf: function (item) {
                if (typeof item.checked == "undefined") {
                    Vue.set(item, "checked", true);
                } else {
                    item.checked = !item.checked;
                }
            },
            downShow:function(item){
                if(typeof item.subItemShowFlag == "undefined") {
                    Vue.set(item, "subItemShowFlag", true);
                }else{
                    item.subItemShowFlag = !item.subItemShowFlag;
                }
            },
            userShow:function(subItem){
                var _this = this;

                if(typeof subItem.userShowFlag == "undefined") {
                    Vue.set(subItem, "userShowFlag", true);
                }else{
                    subItem.userShowFlag = !subItem.userShowFlag;
                }
            },
            choseUser:function(user){
                if(typeof user.checked == "undefined") {
                    Vue.set(user, "checked", true);
                }else{
                    user.checked = !user.checked;
                }
            },
            allChose:function (subItem) {
                if(typeof subItem.checked == "undefined"){
                    Vue.set(subItem,"checked",true);
                    subItem.dicUsersList.forEach(function(user,index){
                        if(typeof user.checked == "undefined"){
                            Vue.set(user,"checked",true);
                        }
                    });
                }else{
                    subItem.checked = !subItem.checked;
                    Vue.delete(subItem,"checked",true);
                    subItem.dicUsersList.forEach(function(user,index){
                        user.checked = !user.checked;
                        Vue.delete(user,"checked",true);
                    });
                }
            }
        }
    });//vue 实例结束


    layui.use(['layer',"form",'laydate','upload'], function(){
        var form = layui.form(),
                layer = layui.layer,
                laydate = layui.laydate;
    });
</script>
</body>
</html>